<script lang="ts" setup>
import { reactive, watch } from 'vue';

const user = reactive({
  name: '张三',
  info: {
    gender: "男",
    age: 18
  }
})

// watch(()=>user.info,() => {
//   console.log('user.info变化了')
// },{deep:true})

watch(user.info,() => { 
  console.log('user.info变化了')
})
</script>

<template>
<p>{{ user }}</p>
<button @click="user.name='里斯'" > 改名</button>
<button @click="user.info.age++">年龄+1</button>
</template>